<template> 
<el-card class="form-container" shadow="never">
  <el-form :model="updateTestStatusForm"   ref="updateTestStatusFormRef" >
          
             
  			<span>题号{{this.$route.query.id}}</span>
             <el-form-item label="做题情况：" >
                <el-select   size="mini" v-model="updateTestStatusForm.testStatus" placeholder="全部" >
                  <el-option
                    v-for="item in testStatusOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
                <el-button
                style="float: right;margin-right: 15px"
                type="primary"
                @click="handleUpdateTestStatus()"
                size="mini">
                提交
             </el-button>
             </el-form-item>

             <el-form-item label="我的答案史：" prop="answer">
         			 <tinymce :width="595" :height="300" v-model="updateTestStatusForm.answer_his"></tinymce>
        
      		 </el-form-item>
           
          	
  </el-form>
	</el-card>
</template>
<script>
  import { mapGetters } from 'vuex'
  import {updateTestStatus,getTestStatus} from '@/api/question'
  import Tinymce from '@/components/Tinymce'
  export default {
    name: 'testStatus',
    components: { Tinymce},
    data() {
    	return {
    		updateTestStatusForm:{
    			testStatus:parseInt(this.$route.query.testStatus) ,
    			answer_his:null,
    		},
    		questionId:parseInt(this.$route.query.id)
    	}
    },
    computed:{
      ...mapGetters([
          'testStatusOptions',
          'userid',
          'IMG_URL'
        ]),
      
    },
    created(){
    	let params={}
	    params['questionId']= this.questionId
	    params['userId']=this.userid
    	getTestStatus(params).then(response=>{
         
	         this.updateTestStatusForm.testStatus= response.data.testStatus;
	         this.updateTestStatusForm.answer_his= this.replaceBackImage(response.data.answerHis);
	          
	     })
    },
    methods: {
    	//输入是要处理的字符串,返回的是imgid的数组
      findImageIds(toString){
      	var imgIds = []
      	if (toString===null) return imgIds
        var findstr = new RegExp('src="'+ this.IMG_URL+'[a-zA-Z0-9]+"',"gm")
        var  arr=toString.match(findstr)
       	if (arr===null) return imgIds
        console.log(arr.length)
        arr.forEach(v => {
            var beginIndex=v.lastIndexOf("/")+1
            var sublength=v.length-beginIndex-1 //去掉最后一个引号
            var imgId=v.substr(beginIndex ,sublength) 
            imgIds.push(imgId)
          
        })
       return imgIds
      },
      //输入是要处理的字符串,返回替换的字符串
      replaceImage(toString){
        if (toString===null) return
        var newString=toString.replace(new RegExp(this.IMG_URL,"gm"),"<IMG_URL>") 

        return newString
         

      },
      //输入是要处理的字符串,返回替换的字符串
      replaceBackImage(toString){
        if (toString===null) return
        var newString=toString.replace(new RegExp("<IMG_URL>","gm"),this.IMG_URL) 

        return newString
         

      },


	    handleUpdateTestStatus(){
	       
	        let params={}
	        params['questionId']= this.questionId
	        params['userId']=this.userid
	        params['testStatus']=this.updateTestStatusForm.testStatus
	        var imgIds=this.findImageIds(this.updateTestStatusForm.answer_his)
	        params['imgIds']=imgIds.join(',')
	        params['answerHis']=this.replaceImage(this.updateTestStatusForm.answer_his)
	      
	        updateTestStatus(params).then(response=>{
	          this.$message({
	                          type: 'success',
	                          message: '更新成功',
	                          duration:1000
	                      });

	          
	         })

	      },	
	},
  }
</script>